<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>下药列表</title>
    <script src="../js/jquery-2.1.4.min.js"></script>
    <script src="../js/mui.min.js"></script>
    <link href="../css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../css/cw.css"/>
    <script src="../js/global.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="../js/public.js" ></script>
    <script type="text/javascript" src="../js/app/free-medicine-list.js" ></script>
    <script type="text/javascript" charset="UTF-8">
      	mui.init();
    </script>
    <style type="text/css">
	 	.mui-search .mui-placeholder{background:white;border-radius:2px;}
	 	.mui-bar input[type=search]{margin:0px;height:35px;}
		/*跨webview需要手动指定位置*/
	 	.mui-popover {height:300px;}
		.mui-col-xs-4 .iconfont{position:absolute;top:9px;-webkit-transform: rotate(-180deg);-moz-transform: rotate(-180deg);}	
		.mui-placeholder span{margin: 0px;padding: 0px;line-height: 10px;}
		.medicine-lists>div>li:nth-child(-n+2){line-height:30px;}
		.medicine-lists>div>li:nth-child(3){overflow:hidden;position: absolute;top:30px;right:10px;}
		.mui-numbox {width: 100px;height: 35px;padding: 0 25px;} 
    	.mui-numbox [class*=btn-numbox], .mui-numbox [class*=numbox-btn]{width:30px;}
    </style>
</head>
<body >
	<header id="header" class="mui-bar mui-bar-nav">
		<i class="mui-icon mui-icon-back mui-action-back"></i>
		<div class="medicine-search">
			<div class="mui-input-row mui-search ">
				<input type="search" contenteditable="true"  class="mui-input-clear search" placeholder="搜索">
			</div>			
		</div>
	</header> 
	<div id="content" class="mui-content background"></div>
		
		<div class="overflow-h medicine-list-3">			
			<div class="mui-col-xs-4">
				<a href="#top-1" class="color-000 ">
				<span>味性</span>
				<span class="iconfont">&#xe638;</span>
				</a>
			</div>		
			<div class="mui-col-xs-4">
				<a href="#top-2" class="color-000">
				<span>功效</span>
				<span class="iconfont">&#xe638;</span>
				</a>
			</div>
			<div class="mui-col-xs-4">
				<a href="#top-3" class="color-000">
				<span>三品</span>
				<span class="iconfont">&#xe638;</span>
				</a>
			</div>	
		</div>
		<div class="medicine">
			
		</div>
				<!--<div class="mui-table-view medicine-lists overflow-h mui-table-view-cell">
			<div><img src="../images/iconic.png" alt="" /></div>
			<div class="overflow-h">
				<li class="font-16">灵芝</li>
				<li class="color-red font-13">1元/克</li>
				<li>
					<span class="mui-pull-right">
						<div class="mui-numbox"data-numbox-min='1' data-numbox-max='999'>
							<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
							<input class="mui-input-numbox" type="number" disabled/>
							<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
						</div>
					</span>
				</li>
			</div>
		</div>-->
		<nav class="medicine-nav table-view-cell background">
			<input type="number" class="vice" style="width: 50px; height: 22px;margin: 0;padding: 0; z-index: 2;" /> 副
			<span class="color-red mui-h4">合计：</span>
			<span class="color-red font-15 zongji">0.00元</span>&nbsp;
			<span class="mui-navigate-right mui-pull-right font-14 details"style="margin-right: 20px;">查看详情</span>
		</nav>
		
	<!--左上角弹出菜单-->
		<div id="top-1" class="mui-popover">
			<div class="mui-popover-arrow"></div>
			<div class="mui-scroll-wrapper">
				<div class="mui-scroll">
					<ul class="mui-table-view comedies">
						<!--<li class="mui-table-view-cell"><a href="#top-1">全部</a>
						</li>-->
					</ul>
				</div>
			</div>
		</div>
		<!--中间弹出菜单-->
		<div id="top-2" class="mui-popover">
			<div class="mui-popover-arrow"></div>
			<div class="mui-scroll-wrapper">
				<div class="mui-scroll">
					<ul class="mui-table-view effect">
						<!--<li class="mui-table-view-cell"><a href="#top-2">全部</a>
						</li>-->
					</ul>
				</div>
			</div>
		</div>
		<!--右上角弹出菜单-->
		<div id="top-3" class="mui-popover">
			<div class="mui-popover-arrow"></div>
			<div class="mui-scroll-wrapper">
				<div class="mui-scroll">
					<ul class="mui-table-view attributes">
						<!--<li class="mui-table-view-cell"><a href="#top-3">全部</a>
						</li>-->
					</ul>
				</div>
			</div>
		</div>
	
</body>
	
</html>